<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="./css/mui.min.css">
<title>AIC下载</title>
<style>
.mui-content-padded {
	margin: 5px;
}

.mui-content {
	width: 300px;
	height: 250px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -250px 0 0 -150px;
	background-color: initial;
}

.mui-table-view {
	background-color: initial;
}

.bg {
	background-image: url(./images/login-bg.png);
	background-size: 100%;
	background-repeat: no-repeat;
}

.logo {
	height: 150px;
	text-align: center;
}

.android {
	height: 80px;
	border-style: solid;
	padding: 10px;
	text-align: center;
}

.android p {
	font-size: 28px;
	color: #27CDDB;
}

.andownload {
	font-size: 25px;
	color: #27CDDB;
}

img {
	max-width: 100%;
	height: auto;
}

.tips {
	color: #ffffff;
	font-size: 10px;
	display: none;
	text-align: center;
	float: right;
}

.mui-media {
	border: solid;
	border-color: #27CDDB;
}
</style>
</head>

<body class="bg">
	<div class="mui-content">
		<div class="mui-content-padded">
			<div class="logo">
				<img id="logoimg" src="./images/logo-green.png" width="120px" height="120px" />
			</div>
			<ul class="mui-table-view" style="margin-top: 30px;">
				<li class="mui-table-view-cell mui-media" id="android">
					<a href="https://aicoss.oss-cn-beijing.aliyuncs.com/aic.apk" id="android">
						<img class="mui-media-object mui-pull-left" src="./images/androidm.png">
						<div class="mui-media-body" style="text-align: center; line-height: 40px;">
							<p class='mui-ellipsis andownload'>安卓版下载</p>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media" style="margin-top: 15px; display: none" id="ios">
					<a href="itms-services://?action=download-manifest&url=https://aicoss.oss-cn-beijing.aliyuncs.com/aic.plist">
						<img class="mui-media-object mui-pull-left" src="./images/ios-128.png">
						<div class="mui-media-body" style="text-align: center; line-height: 40px;">
							<p class='mui-ellipsis andownload'>苹果版下载</p>
						</div>
					</a>
				</li>
			</ul>
			<span class="tips">打开手机“设置 -> 通用 -> 设备管理”，点击：信任</span>
		</div>
	</div>
</body>
<script type="text/javascript" src="./js/mui.min.js"></script>
<script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script>
<script>
	mui.init();
	$(function() {
		if (mui.os.ios) {
			$("#android").hide();
			$("#ios").show();
			$(".tips").show();
		}
		if (mui.os.wechat) {
			var winHeight = typeof window.innerHeight != 'undefined' ? window.innerHeight
					: document.documentElement.clientHeight;
			var weixinTip = $('<div id="weixinTip"><p><img src="./images/live_weixin.png" alt="微信打开"/></p></div>');
			$("body").append(weixinTip);

			$("#weixinTip").css({
				"position" : "fixed",
				"left" : "0",
				"top" : "0",
				"height" : winHeight,
				"width" : "100%",
				"z-index" : "1000",
				"background-color" : "rgba(0,0,0,0.8)",
				"filter" : "alpha(opacity=80)",
			});
			$("#weixinTip p").css({
				"text-align" : "center",
				"margin-top" : "10%",
				"padding-left" : "5%",
				"padding-right" : "5%"
			});
		}
	});
</script>

</html>